import { createRouter as createVueRouter, createWebHistory } from "vue-router";
import { type RouteRecordRaw } from "vue-router";

const routes: Array<RouteRecordRaw> = [
  {
    path: "/",
    name: "home",
    meta: {
      title: "首页",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/StudyVue3/index.vue"),
  },
  {
    path: "/readNovel",
    name: "readNovel",
    redirect: "/readNovel/novelList",
  },
  {
    path: "/readNovel/novelList",
    name: "novelList",
    meta: {
      title: "小说列表",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/ReadNovel/index.vue"),
  },
  {
    // 配置动态路由
    path: "/readNovel/novelContent/:novelName/:novelCnName",
    name: "novelContent",
    meta: {
      title: "小说内容",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/ReadNovel/NovelContent.vue"),
  },
  {
    path: "/shenMiFuSu",
    name: "shenMiFuSu",
    meta: {
      title: "小说-神秘复苏",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/ReadNovel/ShenMiFuSu.vue"),
  },
  {
    path: "/order",
    name: "order",
    meta: {
      title: "支付-订单",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/PayView/index.vue"),
  },
  {
    path: "/svg",
    name: "svg",
    meta: {
      title: "svg图标",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/SvgView/index.vue"),
  },
  {
    path: "/text-fault",
    name: "text-fault",
    meta: {
      title: "文字故障效果",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/TextFault/index.vue"),
  },
  {
    path: "/eyes-follow",
    name: "eyes-follow",
    meta: {
      title: "眼睛跟随鼠标效果",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/EyesFollow/index.vue"),
  },
  {
    path: "/svg-border",
    name: "svg-border",
    meta: {
      title: "SVG图片边框动画",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/SvgBorder/index.vue"),
  },
  {
    path: "/video-textualize",
    name: "video-textualize",
    meta: {
      title: "视频文本化",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/VideoTextualize/index.vue"),
  },
  {
    path: "/picture-grid",
    name: "picture-grid",
    meta: {
      title: "图片九宫格",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/PictureGrid/index.vue"),
  },
  {
    path: "/large-file-segment-upload",
    name: "large-file-segment-upload",
    meta: {
      title: "大文件分片上传",
      keepAlive: true,
      requireAuth: false,
    },
    component: () => import("@/views/demo/FileUpload/LargeFileSegmentUpload.vue"),
  },
  // 如果访问的是其他未定义的路由，则重定向到首页
  {
    // path: "*", // vue2配置写法。
    path: "/:pathMatch(.*)", // vue3配置写法。vue3做了修改，必须要使用正则匹配
    redirect: "/",
  },
];

const createRouter = () =>
  createVueRouter({
    history: createWebHistory(),
    routes,
  });

export default createRouter;
